export const alert_parent = {
    data() {
        return {
            alertFlag: false
        }
    },
    methods: {
        openAlert() {
            this.alertFlag = true;
        },
        closeAlert() {
            this.alertFlag = false;
        },
    }
}
export const alert_child = {
    mounted() {
        if (this.$props.transition.from === "left") {
            this.$refs["alert_box"].style.left = "-100vw";
            this.$refs["alert_box"].style.top = 0;
        } else if (this.$props.transition.from === "right") {
            this.$refs["alert_box"].style.left = "100vw";
            this.$refs["alert_box"].style.top = 0;
        } else if (this.$props.transition.from === "top") {
            this.$refs["alert_box"].style.top = "-100vh";
            this.$refs["alert_box"].style.left = 0;
        } else if (this.$props.transition.from === "bottom") {
            this.$refs["alert_box"].style.top = "100vh";
            this.$refs["alert_box"].style.left = 0;
        }
        setTimeout(() => {
            this.$refs["alert_box"].style.top = 0;
            this.$refs["alert_box"].style.left = 0;
        }, 200);
    },
    methods: {
        back() {
            if (this.$props.transition.to === "left") {
                this.$refs["alert_box"].style.left = "-100vw";
            } else if (this.$props.transition.to === "right") {
                this.$refs["alert_box"].style.left = "100vw";
            } else if (this.$props.transition.to === "top") {
                this.$refs["alert_box"].style.top = "-100vh";
            } else if (this.$props.transition.to === "bottom") {
                this.$refs["alert_box"].style.top = "100vh";
            }
            setTimeout(() => {
                this.$emit("close");
            }, 200);
        },
    }
}